<template>
  <div>
    <div v-if="ReserTables.length < 1" class="text-center">尚未预约医生</div>
    <v-expansion-panels>
      <v-expansion-panel
        v-for="(ReserTable, index) in ReserTables"
        :key="index"
      >
        <v-expansion-panel-header
          class="my-2 pa-5 d-flex rounded-lg cur-point align-center"
        >
          <div>
            <v-avatar size="50">
              <v-img
                :src="ReserTable ? ReserTable.doctorInfo.avatar : ''"
              ></v-img>
            </v-avatar>
          </div>
          <div class="pl-2">
            <div class="primary--text">
              {{ ReserTable ? ReserTable.doctorInfo.name : "" }}
            </div>
            <div class="text-caption">
              {{ ReserTable ? ReserTable.doctorInfo.hospitalName : "" }}
            </div>
          </div>
          <v-spacer></v-spacer>
          <div>{{ ReserTable ? ReserTable.date : "日期" }}</div>
          <div class="ml-2">{{ ReserTable ? ReserTable.time : "时间" }}</div>
        </v-expansion-panel-header>
        <v-expansion-panel-content>
          <v-sheet class="d-flex justify-space-between justify-md-start">
            <v-chip
              color="primary"
              label
              class="px-5 mr-md-2"
              @click="openResInfo(ReserTable)"
              >查看</v-chip
            >
            <v-chip color="primary" label class="px-5 mr-md-2">修改</v-chip>
            <v-chip color="primary" label class="px-5 mr-md-2">评价</v-chip>
            <v-chip
              color="error"
              label
              class="px-5 mr-md-2"
              @click="removeReservation(ReserTable.id)"
              >删除</v-chip
            >
          </v-sheet>
        </v-expansion-panel-content>
      </v-expansion-panel>
    </v-expansion-panels>
  </div>
</template>



<script>
import eventBus from "../../eventBus/eventBus";
export default {
  props: {
    ReserTables: Array,
  },
  methods: {
    openResInfo(ReserTable) {
      eventBus.$emit("openResInfo", ReserTable);
    },
    async removeReservation(reserTableId) {
      try {
        const { data } = await this.$axios.post(
          "reser-table/removeReserTableWithUser",
          {
            reserTableId,
          }
        );

        if (data.code == 200) {
          alert("确认要删除么");
          this.ReserTables = data.data;
        }
      } catch (error) {
        console.log(error);
      }
    },
  },
};
</script>



<style lang="scss" scoped>
</style>
